<template>
	<view>
		<view class="main">
			<view class="detail-title" v-if="detail.state==1">
				<uni-icons type="checkbox" size="50" color="#00B700"></uni-icons>
				<view>审核通过</view>
			</view>
			<view class="detail-title waitting" v-if="detail.state==0">
				<uni-icons type="spinner-cycle" size="50" color="#ffa264"></uni-icons>
				<view>待审核</view>
			</view>
			<view class="detail-title fail" v-if="detail.state==3">
				<uni-icons type="close" size="50" color="#FF0000"></uni-icons>
				<view>拒绝通过</view>
			</view>
			<view class="detail">
				<!-- <view class="detail-cel">
					<text class="lable">饭堂：</text>
					<text>{{detail.canteen ? detail.canteen.name : ''}}</text>
				</view> -->
				<view class="detail-cel">
					<text class="lable">申请人：</text>
					<text>{{detail.username}}</text>
				</view>
				<view class="detail-cel">
					<text class="lable">申请类目：</text>
					<text>{{detail.project.name}}</text>
				</view>
				<view class="detail-cel">
					<text class="lable">申请备注：</text>
					<text>{{detail.content}}</text>
				</view>
				
				<view class="detail-cel">
					<text class="lable">业绩(元)：</text>
					<text class="label-weight">{{detail.price}}</text>
				</view>
				
				<view class="detail-cel">
					<text class="lable">可获积分：</text>
					<text >{{detail.score}}</text>
				</view>
				<view class="detail-cel">
					<text class="lable">申请时间：</text>
					<text class="">{{detail.created_at | time}}</text>
				</view>
				<!-- <view>
					<view class="printer" @click="printer()">打印纸质餐票</view>
					<view class="printer-tips">请确保您已在食堂打印机旁边再打印</view>
				</view> -->
				<!-- <view class="qrimg">
				    <tki-qrcode
				    ref="qrcode"
				    :val="userCard"
					:usingComponents="false"
					:showLoading="false"
					:onval="true"
					:size="400"
					:show="true"
					@result="qrResult">
					</tki-qrcode>
					<view>取餐二维码</view>
				</view> -->
				
			</view>
		</view>
		
	</view>
</template>

<script>
	import moment from '@/utils/moment';
	import helper from '@/utils/helper.js';
	import tkiQrcode from "@/components/tki-qrcode/tki-qrcode.vue";
	import {
		applyResult
	} from '@/api/apply.js'; 

	var that = '';
	export default {
		components:{tkiQrcode},
		data() {
			return {
				detail: {},
				id:'',
				userCard:''
			}
		},
		onLoad(option) {
			that = this;
			this.id = option.id ? option.id : '';
			if (this.id) {
				this.getDetail();
			}
			var user = uni.getStorageSync('user');
			if(user){
				this.userCard = user.member.card_number;
			}
		},
		onReady() {
			this.$refs.qrcode._makeCode();
		},
		filters: {
			// 时间格式化
			time(val) {
				return moment(val * 1000).format('YYYY-MM-DD')
			},
			//转整
			toInt(val) {
				return helper.toInt(val);
			}
		},
		methods: {
			//
			getDetail() {
				var that = this;
				var args = {
				  id:this.id
				};
				uni.showLoading({
					title:'查询中...'
				});
				this.$http.get(`${applyResult}`, {
					...args
				})
				.then(async data => {
					
					uni.hideLoading();
					var res = data;
				   if(res.code==200){
					   
					   that.detail=res.data;
					   this.show_deatil=true;
				   }else{
					   uni.showToast({
					   	title: data.msg ? data.msg : '没有记录！',
					   	icon: 'none'
					   })
				   }
				});

			},
			//
			printer() {
				var that = this;
				var args = {
				  id:this.id
				};
				uni.showLoading({
					title:'打印中...'
				});
				meal.printerOne(args, (res) => {
					uni.hideLoading();
				   if(res.errcode==0){
						uni.showToast({
							title: '打印成功',
							icon: 'success'
						})
				   }else{
						uni.showModal({
							title:"提示",
							content:data.errmsg ? data.errmsg : '打印失败',
						})
				   }
				});
			
			},
			qrResult:function(res) {
				this.h5Qrcode = res
			}
		}
	}
</script>

<style lang="scss">
	page{background-color: #F1F1F1;}
	.main {
		margin: 20rpx 2%;
		border-radius: 20rpx;
		background-color: #fff;
		padding: 40rpx 0%;
		line-height: 40rpx;
		font-size: 28rpx;
		color: #333333;
	}

	.detail-title .iconfont {
		margin-right: 20rpx;
		    font-size: 68rpx;
		    margin-bottom: 40rpx;
	}

	.detail-title {
		text-align: center;
		font-size: 42rpx;
		margin-bottom: 20rpx;
		font-weight: bold;
		color: #00B700;
		padding: 0rpx 0 30rpx;
		border-bottom: 2rpx solid #EEEEEE;
	}

	.detail {
		width: 90%;
		margin: auto;
		line-height: 50rpx;
	}

	.detail-cel {
		display: flex;
		justify-content: space-between;
		line-height: 48rpx;
		margin-bottom: 20rpx;
	}

	.lable {
		color: #999999;
		width: 30%;
	}

	.label-weight {
		color: #FF0000;
		font-size: 32rpx;
	}
	.use-time{font-size: 48rpx;}
	.printer{background-color:#ff6600 ;margin-top: 30rpx;padding: 25rpx 0; text-align: center;color: #fff;border-radius: 60rpx;font-size: 30rpx;}
	.printer-tips{text-align: center;color: red;margin-top: 10rpx;}
	.qrimg{margin:0 auto;margin-top: 30rpx;text-align: center;}
	
	.waitting{color: #ffa264;}
	.fail{color: #FF0000;}
</style>
